<template>
  <div class="inquireStyle" style="width: 100%">
    <el-form ref="form" :class="{ flex: styleFlex }" style="flex-wrap: wrap" :model="form" label-width="105px">
      <div class="putaway" v-for="item in dataUire" :key="item.key">
        <el-form-item :label="item.name">
          <template v-if="item.type === 'text'">
            <el-input :placeholder="item.placeholder" v-model="form[item.key]" :type="item.textarea || 'text'" :disabled="item.disabled"></el-input>
          </template>
          <template v-else-if="item.type === 'month' || item.type === 'date' || item.type === 'time' || item.type === 's_e'">
            <el-date-picker
              v-model="form[item.key]"
              :type="item.type === 'month' ? 'month' : (item.type === 'date' ? 'date' : 'datetime')"
              @input="handleDatePickerInput(item, $event)"
              :placeholder="item.placeholder"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :default-time="['12:00:00']"
            ></el-date-picker>
          </template>
          <template v-else-if="item.type === 'select_m' || item.type === 'select_a' || item.type === 'select'">
            <el-select
              v-model="form[item.key]"
              :multiple="item.type === 'select_m'"
              :allow-create="item.type === 'select_a'"
              filterable
              :placeholder="item.placeholder"
              @change="$emit('change', form[item.key])"
            >
              <el-option
                v-for="select in item.children"
                :key="select.value"
                :label="select.label"
                :value="select.value"
              ></el-option>
            </el-select>
          </template>
          <template v-else-if="item.type === 'slot'" >
            <slot :name="item.key" :row="item"></slot>
          </template>
          
        
        </el-form-item>
      </div>
      <el-form-item :class="{ button_onSubmit: styleFlex }">
        <slot name="center" :row="form">
          <div v-if="dataUire.length > 0 && button_show">
            <el-button class="chaxun" @click="onSubmit">{{ buttonTitle }}</el-button>
            <el-button class="chongzhi" @click="cls" v-show="showResetting">重置</el-button>
          </div>
        </slot>
      </el-form-item>
      
    </el-form>
  </div>
</template>

<script>
export default {
 
  data() {
    return {
      form: this.formData, // 表单数据对象
    };
  },
  methods: {
    handleDatePickerInput(item, value) {
      if (item.type === 'month') {
        this.form[item.key] = this.dateDays(value);
      } else if (item.type === 'date') {
        this.form[item.key] = this.Date_nhms(value);
      } else if (item.type === 'time') {
        this.form[item.key] = this.timestampToTime(value);
      } else if (item.type === 's_e') {
        this.dateseFun(value, item.key);
      }
    },
    // 其他方法定义
    // ...
  },
  props: {
    dataUire: {
      type: Array,
      default: () => [],
    },
    styleFlex: Boolean,
    button_show: Boolean,
    buttonTitle: String,
    showResetting: Boolean,
    formData:{
      type: Object,
      default: () => {
        return {};
      },
    }
  },
};
</script>

<style scoped>
/* 样式定义 */
</style>
